<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>安全承诺</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
	
		<link rel="stylesheet" href="../../../css/mui.min.css">
		<link rel="stylesheet" href="../css/common.css" />
		<link rel="stylesheet" href="../formal/css/quill.css" />
		<style>
			.signform{
        padding: 20px 0;
      }
      .signform .btn{
        padding: 15px 0;
        width: 100%;
        display: inline-block;
        text-align: center;
        border-radius: 6px;
      }
      .signform img{
        width: 6.25rem;
		/*
        transform:rotate(-90deg);
        -moz-transform:rotate(-90deg);
        -webkit-transform:rotate(-90deg);
		*/
      }
      .signform .border-bottom{
        border-bottom: 1px solid #dcdcdc;
      }	
	  .padding{
		  padding:0.94rem 8%
	  }
	  body{background:#fff;}
	  ul,li{list-style: none;width:100%;padding:0;}
	  li{font-size:14px;color:#8f8f94;padding:0;}
	  p{display: block;}
	  .wxk{height:5vh;}
		</style>
	</head>
	<body>
    <header class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title">安全承诺</h1>
    </header>
	<div class="wxk"></div>
    <div class="mui-content bg-white padding-bottom" id="container">
      <div class="padding">
		<div style="width: 86%;margin:0 7%;text-align:center;height:50px;line-height: 40px;
		border-bottom:1px dashed #ABAAAA">外来人员入场安全承诺书</div>
        <div class="signform" v-html="html"></div>
		<div class="tijiaocns" v-if="tijiaocns">
        <div class="signform flex">
          <div>签名：</div>
          <div class="flex-sub border-bottom text-center" @click="sign()">
            <img :src="signImg" >
          </div>
        </div>
        <div class="signform flex">
          <span class="bg-blue text-white btn" @click="submit()">保存提交</span>
        </div>
		</div>
      </div>
    </div>
	</body>
  <script src="../../../js/mui.min.js"></script>
  <script src="../../../js/jquery-3.2.1.min.js"></script>
  <script type="text/javascript" src="../../../js/vue.js"></script>
  <script src="../js/mkeyplus.base.js"></script>
  <script src="../formal/js/api.js"></script>
  <script>
    var page = null;
	var htapi = new HTGlobal();
  	mui.init()
  	page = new Vue({
  	  el: '#container',
  	  data: {
  	    signImg:'',
        time:'',
		html:'',
		tijiaocns:false,
		form:{
			pactContent:'',
			signature:'',
			projectId:'',
			appUserId:'',
			compellation:'',
			pactId:''
		}
  	  },
  	  created: function() {
        if(localStorage.getItem('dataURL')){
          this.signImg=localStorage.getItem('dataURL');
        }
        this.nowDate()
		
		
		this.pload()
      },
  	  methods: {
		pload(){
			
		},  
        nowDate(){
          var date = new Date()
          var year = date.getFullYear()
          	
          /* 在日期格式中，月份是从0开始的，因此要加0
           * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
           * */
          var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1
          var day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate()
          var hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()
          var minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
          var seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
          // 拼接
          this.time = year + '年' + month + '月' + day + '日'
        },
  	    sign(){
          
  	      mui.openWindow({
  	        url: '../sign/index.html',
  	        id: '../sign/index.html',
  	      });
  	    },
  	    submit() {
          var _this=this
          if(_this.signImg==''){
              mui.toast('请签名');
              return false;
          }
		  var Ctxt = this.html;
		  Ctxt = Ctxt.replace(/</ig,'&lt;');
		  this.form.pactContent = Ctxt.replace(/>/ig,'&gt;');
		  this.form.signature = this.signImg.replace(/^data:image\/\w+;base64,/,'');
  	      var user = localStorage.getItem('outUser');
		  if(user){
			user = JSON.parse(user);  
			this.form.enterpriseProjectId = user.enterpriseProjectId;
		  }
		  
		  htapi.fetch(this.form,function(data){console.log(JSON.stringify(data))
			  if(data.code=='0'){
				  mui.fire(plus.webview.currentWebview().opener(),'reload',false)
				  plus.webview.currentWebview().close();
			  }else{
				  mui.toast(data.msg)
			  }
		  },'保存中','appUserPactAddInfo','post')
		  
		  localStorage.removeItem('dataURL');
  	    }
  	  }
  	})	
  	window.addEventListener("signUrl", function(e) {
  	  console.log(JSON.stringify(e))
      page.signImg=e.detail.dataURL
  	});
	
	mui.plusReady(function(){
		var user = localStorage.getItem('outUser');
		if(user){
			user = JSON.parse(user);
			page.form.compellation = user.compellation;
			page.form.appUserId = user.id;
			page.form.projectId = user.currentProjectId;
			
			plus.nativeUI.showWaiting('加载中');
			//判断是否已提交安全承诺
			htapi.fetch({appUserId:user.id,projectId:user.currentProjectId,
			enterpriseProjectId:user.enterpriseProjectId},function(data){
				if(data.code=='0'){
					if(!data.data){
						//没有提交，请求安全承诺书
						htapi.apiUrl[htapi.apiKey].temporary = htapi.apiUrl[htapi.apiKey].getSafetyCommit+user.currentProjectId;
						htapi.fetch({},function(res){
							plus.nativeUI.closeWaiting();
							if(res.code=='0'){
								page.tijiaocns = true;
								page.form.pactId = res.data.pactId;
								var cont = res.data.content;
								cont = cont.replace('{#username#}',user.compellation)
								cont = cont.replace('{#company#}',user.enterpriseName)
								if(!user.content)user.content = '';
								cont = cont.replace('{#content#}',user.content||'')
								cont = cont.replace('{#phone#}',user.phone)
								cont = cont.replace('{#signature#}','<span style="color:#fff">{#signature#}</span>')
								cont = cont.replace('{#date#}',page.time)
								cont = cont.replace(new RegExp('{#stationName#}',"g"),res.data.stationName)
								page.html = cont;
								
								
							}
							delete htapi.apiUrl[htapi.apiKey].temporary;
						},false,'temporary')
					}else{
						//已提交
						htapi.fetch({appUserId:user.id,projectId:user.currentProjectId,
						enterpriseProjectId:user.enterpriseProjectId},function(data){
							plus.nativeUI.closeWaiting();
							if(data.code=='0'){
								var cont = data.data.pactContent;
								console.log(htapi.filePath+data.data.signatureId);
								//显示签名图片
								cont = cont.replace('{#username#}',user.compellation+'<br>'+
								'<img style="width:8%" id="loadtu" src="../sign/loading.gif" /><img onload="imgload()" width="50%" src="'+htapi.filePath+data.data.signatureId+'?token='+localStorage.getItem('token')+'"/><br>')
								cont = cont.replace('{#company#}',user.enterpriseName)
								if(!user.content)user.content = '';
								cont = cont.replace('{#content#}',user.content)
								cont = cont.replace('{#phone#}',user.phone)
								cont = cont.replace('{#date#}',data.data.createTime)
								cont = cont.replace('{#signature#}','<span style="color:#fff">{#signature#}</span>');
								cont = cont.replace(new RegExp('{#stationName#}',"g"),data.data.stationName)
								page.html = cont;
							}
						},false,'findSaftyCommit','post')
					}
				}
			},false,'isSubmitSafetyCommit','post')
		}
	})
	
	var imgload = function(){
			  var tu = $('#loadtu');
			  tu.remove();
	}
	var old_back = mui.back
	mui.back = function(){
		mui.fire(plus.webview.currentWebview().opener(),'reload',false)
		old_back()
	}
  </script>
</html>
